<!--
 * @Description: 数据产品-待审核列表
 * @Author: xinqiao lxq1990.0716@qq.com
 * @Date: 2025-03-11
 * @LastEditors: xinqiao lxq1990.0716@qq.com
 * @LastEditTime: 2025-03-13
-->
<script lang="ts" setup>
  import { message } from 'ant-design-vue'
  import { computed, onMounted, reactive, ref } from 'vue'
  import { useRouter } from 'vue-router'

  import { getDataProductList } from '/@/api/exchange/dataProduct'
  import { HttpCodeEnum } from '/@/enums/httpEnum'
  import { formatDate } from '/@/utils/date'

  const router = useRouter()
  const loading = ref(false)
  const dataList = ref<DataProductTypes.IResponse[]>([])
  const searchParam = reactive({
    productName: '',
    createdBy: '',
    applyTime: [],
    productSource: undefined,
  })
  const pagination = ref({
    total: 0,
    current: 1,
    pageSize: 10,
  })
  const plantformList = [
    { value: 1, label: '个人用户' },
    { value: 2, label: '平台自建' },
  ]

  /** 表格列配置 */
  const columns = [
    { title: '产品名称', dataIndex: 'productName' },
    { title: '创建人', dataIndex: 'createdBy' },
    { title: '所属平台', dataIndex: 'productSource', key: 'productSource' },
    { title: '申请时间', dataIndex: 'updatedTime', key: 'updatedTime' },
    { title: '操作', key: 'action' },
  ]

  const page = computed(() => ({
    pageIndex: pagination.value.current,
    pageSize: pagination.value.pageSize,
  }))

  // 获取页面list
  const getData = async () => {
    loading.value = true
    const params = {
      ...page.value,
      ...{
        productName: searchParam.productName,
        createdBy: searchParam.createdBy,
        productSource: searchParam.productSource,
        applicationTimeStart: searchParam.applyTime[0],
        applicationTimeEnd: searchParam.applyTime[1],
        status: 2,
      },
    }
    const { responseCode, responseData } = await getDataProductList(params)
    if (responseCode === HttpCodeEnum.SUCCESS) {
      dataList.value = responseData.records || []
      pagination.value.total = +responseData.total || 0
    }
    loading.value = false
  }

  // 分页查询
  const onPaginationChange: TableProps['onChange'] = (tabPage: TablePaginationConfig) => {
    pagination.value.current = tabPage.current || 1
    pagination.value.pageSize = tabPage.pageSize || 10
    getData()
  }

  // 重置
  const clear = () => {
    searchParam.productName = ''
    searchParam.createdBy = ''
    searchParam.applyTime = []
    searchParam.productSource = undefined
    getData()
  }

  // 搜索
  const getSearch = () => {
    pagination.value.current = 1
    getData()
  }

  // 待审核数据详情
  const goDetail = (id: number) => {
    router.push({
      path: '/data-product/detail',
      query: { id },
    })
  }

  onMounted(() => {
    getData()
  })
</script>

<template>
  <div class="ssc-list uncheck-list">
    <div class="ssc-search">
      <a-row :gutter="24">
        <a-col :span="8">
          <a-form-item label="产品名称">
            <a-input v-model:value="searchParam.productName" placeholder="请输入" />
          </a-form-item>
        </a-col>
        <a-col :span="8">
          <a-form-item label="创建人">
            <a-input v-model:value="searchParam.createdBy" placeholder="请输入" />
          </a-form-item>
        </a-col>
        <a-col :span="8">
          <a-form-item label="所属平台">
            <a-select v-model:value="searchParam.productSource" :options="plantformList" placeholder="请选择" />
          </a-form-item>
        </a-col>
        <a-col :span="10">
          <a-form-item label="申请时间">
            <a-range-picker v-model:value="searchParam.applyTime" show-time :allowClear="false" format="YYYY-MM-DD HH:mm:ss" valueFormat="YYYY-MM-DD HH:mm:ss" />
          </a-form-item>
        </a-col>
        <a-col :span="14">
          <a-row justify="end">
            <a-button @click="clear()">重置</a-button>
            <a-button class="ml-4" type="primary" @click="getSearch()">查询</a-button>
          </a-row>
        </a-col>
      </a-row>
    </div>
    <div class="ssc-table">
      <div class="ssc-table-header">
        <span class="ssc-table-header-title">待审核数据产品</span>
      </div>
      <a-table :columns="columns" :data-source="dataList" :loading="loading" :pagination="pagination" @change="onPaginationChange">
        <template #bodyCell="{ column, record }">
          <template v-if="column.key === 'productSource'">
            <text>{{ record.productSource === 1 ? '个人' : '平台' }}</text>
          </template>
          <template v-if="column.key === 'updatedTime'">
            <text>{{ formatDate(record.updatedTime) }}</text>
          </template>
          <template v-if="column.key === 'action'">
            <a @click="goDetail(record.id)">开始审核</a>
          </template>
        </template>
      </a-table>
      <!-- <a-table :columns="columns" :data-source="dataList" :loading="loading" :pagination="pagination" @change="onPaginationChange">
        <template #bodyCell="{ column, record }">
          <template v-if="column.key === 'action'">
            <span>
              <a @click="goUncheckDetail(record)">开始审核</a>
            </span>
          </template>
        </template>
      </a-table> -->
    </div>
  </div>
</template>

<style lang="less" scoped></style>
